<template>
  <div class="wage-set-wrapper p24 page-miH page-bgBack">
    <a-tabs :activeKey="currentKey" @change="changeSort">
      <a-tab-pane :key="1" tab="待处理" />
      <a-tab-pane :key="2" tab="已处理" />
      <a-tab-pane :key="3" tab="我发起" />
      <a-tab-pane :key="4" tab="抄送我" />
    </a-tabs>
    <div class="approval-content">
      <!--根据状态展示不同状态数据  approvalTabState 1,2,3,4  -->
      <ListContent :approvalTabState="currentKey" />
    </div>
  </div>
</template>

<script>
import ListContent from "./listContent";
export default {
  inject: ["reload"],
  name: "",
  components: { ListContent },
  data() {
    return { currentKey: 1 };
  },
  mounted() {
    const st = this.$route.query.operateFromShortcut;
    if (st === "yichuli") {
      this.changeSort(2);
    } else if (st === "wofaqi") {
      this.changeSort(3);
    } else if (st === "chaosongwo") {
      this.changeSort(4);
    }
  },
  methods: {
    changeSort(e) {
      this.currentKey = e;
    }
  }
};
</script>
<style lang="scss" scoped>
.backgroundre {
  background-color: #efefef;
}
.approval-wrapper {
  background: #efefef !important;
  .tab-top {
    .ant-tabs-nav-wrap {
      display: block;
    }
    .ant-tabs-bar {
      border-bottom: none;
    }
  }
  .ant-tabs-nav-wrap {
    width: 100%;
    height: 48px;
    display: block;
    background: #fff;
    padding: 0 24px;
  }
}
.approval-content {
  padding: 24px;
  background: #fff;
}
</style>
